<!DOCTYPE html>
<html>
<head>
	<title></title>
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="__PUBLIC__/css/bootstrap.css">
	<link rel="stylesheet" type="text/css" href="__PUBLIC__/webuploader/webuploader.css">
	<script type="text/javascript" src="__PUBLIC__/js/jquery.js" ></script>
	<script type="text/javascript" src="__PUBLIC__/webuploader/webuploader.js"></script>
</head>
<body>

	<div class="login_banner">
		<form role="form" class="form-horizontal" method="post" action="{:U('insert')}">
			
			<div class="form-group text-center">
   	     		<label class="control-label">商品录入</label>
   	    	</div>

   	    	<div class="form-group">
   	     		<label class="control-label col-sm-4">商品名称:</label>
   	     		<div class="col-sm-4 ">
   	     			<input type="varchar" name="name" placeholder="请输入商品名称" class="form-control" />
   	     		</div>
   	    	</div>

	   	    <div class="form-group">
	   	     	<label class="control-label col-sm-4">商品价格:</label>
	   	     	<div class="col-sm-4 ">
	   	     		<input type="decimal" name="price" placeholder="请输入商品价格" class="form-control" />
	   	     	</div>
	   	    </div>

	   	    <div class="form-group">
	   	     	<label class="control-label col-sm-4">商品数量:</label>
	   	     	<div class="col-sm-4 ">
	   	     		<input type="int" name="number" placeholder="请输入商品数量" class="form-control" />
	   	     	</div>
	   	    </div>

	   	    <div class="form-group">
   	     		<label class="control-label col-sm-4">商品分类:</label>
   	     		<div class="col-sm-4 " class="form-control">
	   	     		<volist name="list" id="vovo">
	   	     			<input type="checkbox" name="product_class_cid[]" value="{$vovo.cid}" />
	   	     			{$vovo.cname}
	   	     		</volist>
   	     		</div>
   	    	</div>

	   	    <div class="form-group">
	   	     	<label class="control-label col-sm-4">商品推荐:</label>
	   	     	<div class="col-sm-4 ">
	   	     		<select type="varchar" name="recommend"  class="form-control">
	   	     			<option value="不推荐" selected="selected">不推荐</option>
	   	     			<option value="推荐">推荐</option>
	   	     		</select>
	   	     	</div>
	   	    </div>

	   	    <div class="form-group">
	   	     	<label class="control-label col-sm-4">商品介绍:</label>
	   	     	<div class="col-sm-4 ">
	   	     		<textarea id="container" name="introduction" type="text/plain">
                    </textarea>
                    <script type="text/javascript" src="http://localhost/utf8-php/ueditor.config.js"></script>
                    <script type="text/javascript" src="http://localhost/utf8-php/ueditor.all.js"></script> 
                    <script type="text/javascript">
                       var ue = UE.getEditor('container',{
                           autoHeightEnabled:false,
                           initialFrameHeight:200,  });
                    </script> 
	   	     	</div>
	   	    </div>

	   	    <div class="form-group">
	   	     	<label class="control-label col-sm-4">商品状态:</label>
	   	     	<div class="col-sm-4 ">
	   	     		<select type="varchar" name="status" class="form-control">
	   	     			<option value="不上架">不上架</option>
	   	     			<option value="上架" selected="selected">上架</option>
	   	     		</select>
	   	     	</div>
	   	    </div>

	   	    <div class="form-group">
	   	     	<label class="control-label col-sm-4">商品页标题:</label>
	   	     	<div class="col-sm-4 ">
	   	     		<textarea name="title" rows="4" cols="20" placeholder="请输入商品页标题" class="form-control"></textarea>
	   	     	</div>
	   	    </div>

	   	    <div class="form-group">
	   	     	<label class="control-label col-sm-4">商品页关键词:</label>
	   	     	<div class="col-sm-4 ">
	   	     		<textarea name="keyword" rows="4" cols="20" placeholder="请输入商品页关键词" class="form-control"></textarea>
	   	     	</div>
	   	    </div>

	   	    <div class="form-group">
	   	     	<label class="control-label col-sm-4">商品页描述:</label>
	   	     	<div class="col-sm-4 ">
	   	     		<textarea name="description" rows="4" cols="20" placeholder="请输入商品页描述" class="form-control"></textarea>
	   	     	</div>
	   	    </div>   	    

			<div id="uploader" class="wu-example form-group">	
			    <!--用来存放文件信息-->
			    <div id="thelist" class="uploader-list"></div>
			    <div class="btns col-sm-4 control-label">
			        <div id="picker">选择文件</div>
			    </div>
			</div>

			
	   	    <div class="form-group">
	   	        <div class="col-sm-4 control-label">
	   	     	    <input type="reset" name="button" value="重置">
	   	     	</div>
	   	     	<div class="col-sm-4 control-label">
	   	     		<button>提交</button>
	   	     	</div>
	   	    </div>
   	    
		</form>
	</div>
</body>
<script type="text/javascript">
	//初始化uploader
	var row = 0;
	var uploader = WebUploader.create({
		// 选完文件后，是否自动上传。
    	auto: true,
	    // swf文件路径
	    swf: '__PUBLIC__/webuploader/Uploader.swf',

	    // 文件接收服务端。
	    server: "{$upload}",

	    // 选择文件的按钮。可选。
	    // 内部根据当前运行是创建，可能是input元素，也可能是flash.
	    pick: '#picker',

	    // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
	    resize: false
	});
	//上传成功后进行处理
	uploader.on( 'uploadSuccess', function( file,res ) {
		if(res.status=='OK'){
			var $li = $(
		            '<div id="' + file.id + '" class="file-item thumbnail">' +
		                '<img id="' + file.id + 'img" />' +
		                '<input type="hidden" name="photos['+row+']" id="' + file.id + 'input" />' +
		            '</div>'
		            );

		    // $list为容器jQuery实例
		    $('#thelist').append( $li );
			console.log(res);
		    $( '#'+file.id+'input' ).val(res.url);

		    uploader.makeThumb( file, function( error, src ) {
		        if ( error ) {
		            $( '#'+file.id+'img' ).replaceWith('<span>不能预览</span>');
		            return;
		        }

		        $( '#'+file.id+'img' ).attr( 'src', src );
		    }, 100, 100 );
		    row++;
		}else{
			alert(res.msg);
		}
	});
</script>
</html>